<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
				margin: 0 auto;
				padding: 0;
			}
			a{
				color:black;
				text-decoration: none;
			}
			#nav ul li {
				float: left;
				list-style-type: none;
				padding-left: 20px;
				padding-right: 20px;
				margin-top: 5px;
			}
			
			#nav {
				/*border: 1px solid red;*/
				position: relative;
				display: inline-block;
				background: #E8E8E8;
			}
			ul{
				float: left;
				line-height: 20px;
			}
			#n {
				float: left;
				margin-top:2px ;
				/*border: 1px solid red;*/
				padding-right:40px ;
				margin-left: 5px;
			}
			#ta{
				position: absolute;
				top:9px;
				right: 10px;
			}
			#nav #tp{
				display: none;
			}
			#nav ul li a:hover #tp{
				display: block;
			}
			#tp{
				background: white;
				position: absolute;
				top:25px;
				left: 550px;
				border: 1px solid #666666;
				width:370px;
			}
			#hh,#hhh,#hhhh{
				width:350px;
				border-bottom: #666666;
				border-bottom-width:1px ;
				border-bottom-style: solid;
				margin-left: 10px;
				margin-right:10px ;
				padding-bottom: 20px;
				padding-top: 20px;
			}
			
		</style>
	</head>

	<body>
		
		<div id="nav">
			<img src="../img/zx/logo.gif" id="n" />
			<ul>
				<li>购物车</li>
				<li>|</li>
				<li>优惠券</li>
				<li>|</li>
				<li>快速注卡</li>
				<li>|</li>
				<li>各地购课</li>
				<li>|</li>
				<li>手机报</li>
				<li>|</li>
				<li><a href="#">网站导航
					<img src="../img/zx/open_icon.gif" id="ta"/>
					<div id="tp">
						<ul id="hh">
							<li>托福</li>
							<li>雅思</li>
							<li>考研</li>
							<li>职称英语</li>
							<li>初中</li>
							<li>日语</li>
						</ul>
						
						<ul id="hhh">
							<li>网络课堂</li>
							<li>资讯中心</li>
							<li>知识堂</li>
							<li>大师讲坛</li>
							<li>学习论坛</li>
							<li>学词</li>
							<li>考研搜校</li>
						</ul>
						<ul id="hhhh">
							<li>M-Zone</li>
							<li>手机报</li>
							<li>时时英语</li>
						</ul>
					</div>
					</a>
				</li>
			</ul>
		</div>
	</body>

</html>